img { max-width: 100%; }
/*三个幕布层样式*/
.animate-screen { position: absolute; top: 0; left: 0; width: 100%; z-index: 1; }
.fg-screen { position: absolute; top: 0; left: 0; width: 100%; min-height: 100%; z-index: 5; background-image: url('/Apps/O2O/View/public/images/LuckyMoney/bg.jpg?v=201501131921'); background-repeat: no-repeat; background-size: 100% 100%; }
/*声音层*/
.coffee-steam-box { height: 100px; width: 44px; left: 60px; top: -50px; position: absolute; overflow: hidden; z-index: 0; }
.content { padding-bottom: 2.2em; }
/*飞机层*/
.airPlane { width: 62%; position: absolute; top:18px; }
/*派发礼物层*/
.send-gift-screen { position: relative; top: 70px; left: -20px; width:300px; height:220px; overflow-y: hidden; }
/*声音元件 -u-audio*/
.u-audio { position: absolute; top: 20px; width: 63px; right: 0; z-index: 200; }
.u-audio .res_audio { position: absolute; top: 0; left: 0; opacity: 0; height: 0; width: 0; }
.u-audio .btn_audio { width: 100%; height: 26px; }
.u-audio .btn_audio strong, .u-audio .btn_audio .audio_open { display: inline-block; height: 26px; line-height: 26px; vertical-align: middle; }
.u-audio .btn_audio strong { font-size: 14px; color: #fff; opacity: 1; font-weight: normal; }
.u-audio .btn_audio .audio_open { position: absolute; width: 26px; top:-1px; left: 32px; cursor: pointer; }
.u-audio .btn_audio strong.z-hide { opacity: 0; }
.u-audio .btn_audio strong.z-move { -webkit-transition:opacity 0.5s; -moz-transition:opacity 0.5s; -ms-transition:opacity 0.5s; -o-transition:opacity 0.5s; transition:opacity 0.5s; }
.u-audio.z-low { z-index: 1; }
.coffee-steam-box { display: none; }
/*活动详情*/
.info-arrow img { width: 9%; position:absolute; top:95px; right:0px; }
#dialog_msg_content { line-height: 1.4em; padding: 35px 0; }
/*首页接收礼品区*/
.interat_box { margin: 150px auto 0; position: relative; z-index: 2; width: 84%; }
.gift_bg { width: 100% }
/*拆红包*/
.interat-header { width:19.6%; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; position: absolute; top:0; font-size: 16px; }
.interat-header img { width: 100% }
.interat-header img.people_pic { -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; }
/*人物图像*/
.interat-header1 { top: 4.3%;
left: 7.1%;}
.interat-header2 { top: 8.2%;
left: 29.2%; }
.interat-header3 { top: 0.5%; left: 51.5%; }
.interat-header4 { top: 4.2%; left: 73.3%; }
/*帽子*/
.mao img{width: 40px;}
.mao { position: absolute; width:70%; }
.mao1 {top: -48%;
left: -5%; }
.mao2 { top: -55%; left: 27%; }
.mao3 { top: -45%;
left: 49%; }
.mao4 { top: -55%;
left: 35%;
}
.logo { width:18%; top:.7em; left: .8em; position: absolute; }
.giftBtn { width: 60%; display: block; margin: 8px auto 0; }
.giftBtn img { width: 100% }
.activeyNum { padding: .8em 0 .8em }
.activeyNum p { font-size:.9em; color: #934e1b; text-align: center; line-height: 1.2em; }
.activeyNum p em{ font-size:1.5em; color: #fd1013; letter-spacing: 0; font-style: normal;}
/*页脚*/
.footer { width: 100%; height: 2.2em; line-height: 2.2em; background: #ff3a53; opacity: 0.8; text-align: center; position: absolute; bottom: 0; }
.footer a { font-size: 1em; color: #fff; height: 2.2em; line-height: 2.2em; display: inline-block; }
/*活动详情弹出层*/
.dialogLayer { display: none; position: absolute; z-index: 201; width: 100% }
.activeCon { background: #f3cead; padding: .6em; }
.activeCon h2 { font-size:1.3em; color: #8d6b4a; margin-left: -.4em; padding-bottom: .2em; }
.activeTit { margin-top: .3em; }
.activeCon p { font-size: 1em; line-height: 1.4em; color: #886747; }
.underStandBtn { background: #d61618; text-align: center; }
.underStandBtn a { display:block; height: 2.2em; line-height: 2.2em; font-size: 1.1em; color: #fff; }
.underStandBtn a img { margin: .52em .3em 0 0; width: 1.12em }
/*活动分享弹出层*/
.activeShareBtn { width: 74%; display: block; float: right; margin-right: 4px; }
/*帮朋友红包礼盒*/
.helpFriend { margin-top: 170px; }
.giftBox { margin: 0 auto; width: 55%; position: relative; z-index: 2; }
.giftBoxImg { width: 100%; }
.friend_img { width: 47.8%; top:36.65%; position: absolute; left: 50%; margin-left: -23.9%; }
.friend_img img { -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; width: 100%;}
.mask { position: absolute; top: 0px; left: 0px; width: 100%; z-index: 200; opacity: 0.7; background: #000; }
/*拆开红包弹出层*/
.open_gift_box { padding:0.8em 0 .8em 1em; width: 84%; border-left: 12px solid #cbb483; border-right:12px solid #cbb483; margin: 0 auto; background: #f9dabb; text-align: center; position: relative; }
.close-open-gift-layer { position: absolute; top:0; right: -12px; width: 40px; height: 40px; background: url('/Apps/O2O/View/public/images/LuckyMoney/delete.jpg') no-repeat; }
.open_gift_box h2 { font-size:1.6em; color: #6f5343; font-weight: bold; padding: .25em 0 }
.open_gift_box p { color: #8c6e5d; font-size: .85em; line-height: 1.35em; padding: 0 .8em }
.building_logo img { max-width: 45%; }
.prize_mes { color: #d61618; padding: .4em 0 .35em; font-size: 1.2em }
.phone_num { padding-top: .3em; }
.phone_num img { width: 50% }
.get_prize_btn { color: #fff; background: #d61618; display: inline-block; padding:.3em 1.7em; font-size: 1.2em; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.get_prize_btn img { margin: .11em .2em 0 0; width: 1em }
/*圣诞帮他拆红包弹出层*/
.help_gift_box { text-align: center; }
.gift_info { width:90%; position: relative; margin: 4em auto 0; font-size: 1.2em; z-index: 2; }
.gift_info_con { position: absolute; top:0; color: #ef2740; font-weight: bold; line-height: 1.5em; padding: 1.6em 1.8em; word-wrap: break-word; word-break: break-all; }
.gift_join_btn { width:60%; position:absolute; bottom: -.9em; left: 50%; margin-left: -30%; }
.light_box { position: absolute; z-index: 100 }
/*线下兑奖确认页面*/
.gift-page { padding: 1em; }
.gift { margin-bottom: 10px; }
.gift .gift-info { position: absolute; left: 115px; top: 15px; }
.exchange-section { border: 1px solid #EEEBE9; background-color: #FFFFFF; -webkit-border-radius: 5px; border-radius: 5px; padding: 2px; margin-bottom: 10px; }
.exchange-section .exchange-section-inner { border: 1px dashed #DCDCDC; }
.exchange-section h3 { height: 28px; line-height: 28px; background-size: 130px 28px; color: #000; font-size: 16px; padding: 5px 0 0 10px }
.exchange-section .section-content { padding: 10px; }
.exchange-section .section-content .remark { text-indent: 20px; color: #999; }
.exchange-section .gift .gift-content { position: relative; }
.gift-image img { width: 90px; height: 90px; }
.exchange-section .gift .gift-info { left: 100px; top: 0; }
.exchange-section .gift .gift-info h4 { word-break: break-all; word-wrap: break-word; color: #cb0606; margin-bottom: 2px; }
.exchange-section .gift .gift-info p { width: 190px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; font-size: 14px; }
.exchange-section .gift .gift-info .label { display: inline-block; width: 42px; color: #666; }
.exchange-section .exchange-btn { background-color: #FF7501; color: #ffffff!important; padding:8px 0; font-size: 16px; display: block; text-align: center; -webkit-border-radius: 5px; border-radius: 5px; text-decoration: none; }
.exchange-section .exchange-input { padding: 10px 0 15px; }
.exchange-section .exchange-input label { margin-right: 10px; font-size: 18px; font-weight: bold; color: #000; }
.exchange-section .exchange-input input { border: none; border-bottom:1px solid #CDCDCD; height: 30px; width: 220px; }
.exchange-section .exchange-fail { text-align: center; }
.exchange-section .exchange-fail strong { font-size: 18px; font-weight: bold; padding: 15px 0; display: block; line-height: 24px; }
.exchange-section .exchange-fail p { color: #cb0606; font-size: 14px; }
/*线下兑奖页面*/
.cash-page { background: #D62B33; }
.cash-page .cash-wrap { padding: 20px; }
.cash-page .cash-integral { margin: 30px auto 8px; font-weight: bold; color: #FFE08E; text-align: center; }
.cash-page .cash-qr { width: 190px; height: 190px; margin: 0 auto; padding: 8px; background: white; }
.cash-page .qr-code { width: 190px; height: 190px; }
.cash-page .integral-qr { color: #FEEA5D; text-align: center; font-weight: bold; }
.cash-page .cash-info { margin: 10px auto 25px; display: table; color: white; }
.cash-page .cash-rule { color: #FBE0B3; }
/* 用来实现动画的keyframes;  从0度旋转到360度 */
@-webkit-keyframes spin { from {
 -webkit-transform: rotate(0deg);
}
to { -webkit-transform: rotate(360deg); }
}
 @-moz-keyframes spin { from {
 -moz-transform: rotate(0deg);
}
to { -moz-transform: rotate(360deg); }
}
 @-ms-keyframes spin { from {
 -ms-transform: rotate(0deg);
}
to { -ms-transform: rotate(360deg); }
}
.raysDemoHolder { position: relative; width: 100%; text-align: center; vertical-align: middle; margin-top: .9em; }
.raysLogo { position: relative; z-index: 2; top:3em; display: block; }
.raysLogo img { width:36.5%; }
.rays { position: absolute; top: 0px; width: 84%; left: 50%; margin-left: -42.5%; -webkit-animation-name: spin; -webkit-animation-duration: 20000ms; /* 40 seconds */ -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: linear; -moz-animation-name: spin; -moz-animation-duration: 20000ms; /* 40 seconds */ -moz-animation-iteration-count: infinite; -moz-animation-timing-function: linear; -ms-animation-name: spin; -ms-animation-duration: 20000ms; /* 40 seconds */ -ms-animation-iteration-count: infinite; -ms-animation-timing-function: linear; /* boooo opera */ -o-transition: rotate(3600deg); /* works */ }
.rays:hover { /* -webkit-animation-duration: 10000ms; 10 seconds - speed it up on hover! */ }
